radio.views.Radio = Ext.extend(Ext.Panel, {
    cardSwitchAnimation : "slide",
    initComponent : function() {

        this.player = new radio.views.radio.Player();
        Ext.applyIf(this, {
            layout : "card",
            items : [ this.player ]
        });
        radio.views.Radio.superclass.initComponent.apply(this, arguments);
        this.showPlayer();
        alert("showplayer");
    },
    showPlayer : function() {
       this.player.show()
    },
    showNowPlayingButton : function() {
        this.stations.showNowPlayingButton()
    }
});
Ext.ns("radio.views.radio");
radio.views.radio.Player = Ext.extend(Ext.Panel, {
    cls : "radio-player",
    initComponent : function() {
        this.audioPlayer = new radio.views.radio.player.AudioPlayer({
            displayTpl : [ '<tpl if="logo"><img src="{logo}"></tpl>',
                    '<div class="info">', '<div class="name">{name}</div>',
                    "<div>{genre_name}</div>", "<div>{frequency} {band}</div>",
                    "<div>{location} {language}</div>", "</div>",
                    '<div class="clear"></div> ' ],
            listeners : {
                loaded : this.onAudioLoaded,
                scope : this
            }
        });
        Ext.apply(this, {
            items : [ this.audioPlayer ]
        });
        radio.views.radio.Player.superclass.initComponent
                .apply(this, arguments);
    },

    onDescriptionStoreLoad : function(b, a, c) {
        if (c) {
            if (a && a[0]) {
                this.description = a[0].data
            }
        }
        this.tuneStore.load({
            params : {
                id : this.stationId
            }
        })
    },
    onTuneStoreLoad : function(b, a, c) {
        if (c) {
            if (a && a[0]) {
                this.audioPlayer.loadTune(this.prepareTuneData(a[0].data))
            }
        }
    },
    prepareTuneData : function(a) {
        return Ext.apply(a, this.description)
    },
    onBackPressed : function() {
        this.fireEvent("back", this)
    },
    onAudioLoaded : function() {
        this.fireEvent("loaded", this)
    }
});
Ext.ns("radio.views.radio.player");
radio.views.radio.player.AudioPlayer = Ext.extend(Ext.Panel, {
    status : {
        loading : false,
        playing : false,
        preloaded : false
    },
    initComponent : function() {
        
        this.playButton = new Ext.Button({
            cls : "play-button",
            text : "Play",
            listeners : {
                afterrender : this.onPlayButtonAfterRender,
                scope : this
            }
        });
       
        this.displayPanel = new Ext.Panel({
            cls : "player-display",
            tpl : this.displayTpl,
            data : {}
        });
        Ext.apply(this, {
            items : [ this.displayPanel, {
                cls : "button-container",
                height : 180,
                layout : {
                    type : "vbox",
                    align : "center"
                },
                items : [ {
                    cls : "button-holder",
                    items : [ this.playButton ]
                } ]
            } ]
        });
        
        radio.views.radio.player.AudioPlayer.superclass.initComponent.apply(
                this, arguments);
        this.addEvents("loaded")
    },
    resetStatus : function() {
        this.status = {
            loading : false,
            preloaded : false,
            playing : false
        }
    },
    loadTune : function(a) {
        if (this.audio) {
            this.remove(this.audio)
        }
        this.audio = this.add(new Ext.Audio({
            hidden : false,
            preload : false,
            url : a.url,
            listeners : {
                afterrender : this.initAudioEvents,
                scope : this
            }
        }));
        this.resetStatus();
        this.displayPanel.update(a);
        this.doComponentLayout()
    },
    onTogglePlay : function() {
        if (this.audio) {
            if (!this.status.preloaded) {
                this.status.loading = true;
                this.audio.media.dom.load();
                this.audio.play()
            } else {
                this.audio.toggle()
            }
        }
    },
    reset : function() {
        this.displayPanel.update({});
        if (this.status.playing) {
            this.audio.pause()
        }
        if (this.playButton.el) {
            this.playButton.el.removeCls("loading");
            this.playButton.el.removeCls("playing")
        }
    },
    onPlayButtonAfterRender : function(a, b) {
        this.mon(a.el, {
            tap : this.onTogglePlay,
            scope : this
        })
    },
    initAudioEvents : function() {
        this.mon(this.audio.media, {
            loadstart : this.onLoadStart,
            play : this.onPlay,
            pause : this.onPause,
            ended : this.onEnded,
            progress : this.onProgress,
            timeupdate : this.onTimeUpdate,
            loadeddata : this.onLoadedData,
            canplaythrough : this.onCanPlayThrough,
            scope : this
        })
    },
    onLoadStart : function() {

        if (this.status.loading) {
            this.playButton.el.addCls("loading")
        }
    },
    onPlay : function() {
        if (this.status.preloaded) {
            this.playButton.el.addCls("playing");
            this.status.playing = true
        }
    },
    onPause : function() {
        this.playButton.el.removeCls("playing");
        this.status.playing = false
    },
    onEnded : function() {
        this.playButton.el.removeCls("playing");
        this.status.playing = false;
        this.status.preloaded = false
    },
    onProgress : function() {
    },
    onTimeUpdate : function(a, b, c) {
    },
   
    onCanPlayThrough : function() {
    }
});
Ext.ns("radio.views.radio");
Ext.reg("audioPlayer", radio.views.Radio);
